<template>
  <div class="mySubmit" :style="{ 'height': props.height }">
    <el-scrollbar class="scrollbar">
      <el-table :data="judgeList.records" size="small" @row-dblclick="handlerToDeatile">
        <el-table-column prop="submitTime" label="提交时间" align="center">
          <template #default="scoped">
            {{ getDay(scoped.row.submitTime) || "--" }}
          </template>
        </el-table-column>
        <el-table-column prop="status" label="状态" align="center" min-width="130px">
          <template #default="scoped">
            <n-tag type="error" strong v-show="scoped.row.status === -1" round size="small">
              UnAccepted
              <template #icon>
                <i class="iconfont icon-chahao"></i>
              </template>
            </n-tag>
            <n-tag type="success" strong v-show="scoped.row.status === 0" round size="small">
              Accepted
              <template #icon>
                <i class="iconfont icon-ai53"></i>
              </template></n-tag>
            <n-tag type="info" strong v-show="scoped.row.status === 1" round size="small">
              Partial Accepted
              <template #icon>
                <i class="iconfont icon-jinggao"></i>
              </template></n-tag>
            <n-tag type="error" strong v-show="scoped.row.status === 2" round size="small">
              Time Limit Exceeded
              <template #icon>
                <i class="iconfont icon-dengluchaoshi"></i>
              </template>
            </n-tag>
            <n-tag type="error" strong v-show="scoped.row.status === 3" round size="small">
              Memory Limit Exceeded
              <template #icon>
                <i class="iconfont icon-chahao"></i>
              </template></n-tag>
            <n-tag type="error" strong v-show="scoped.row.status === 4" round size="small">
              Runtime Error
              <template #icon>
                <i class="iconfont icon-chahao"></i>
              </template></n-tag>
            <n-tag type="" strong v-show="scoped.row.status === 5" round size="small">
              System Error
              <template #icon>
                <i class="iconfont icon-chahao"></i>
              </template></n-tag>
            <n-tag type="warning" strong v-show="scoped.row.status === 6" round size="small">
              Compile Error
              <template #icon>
                <i class="iconfont icon-chahao"></i>
              </template></n-tag>
            <n-tag type="error" strong v-show="scoped.row.status === 7" round size="small">
              Wrong Answer
              <template #icon>
                <i class="iconfont icon-chahao"></i>
              </template></n-tag>
            <n-tag type="warning" strong v-show="scoped.row.status === 8" round size="small">
              Presentation Error
              <template #icon>
                <i class="iconfont icon-chahao"></i>
              </template></n-tag>
            <n-tag type="error" strong v-show="scoped.row.status === 9" round size="small">
              Submit Failed
              <template #icon>
                <i class="iconfont icon-chahao"></i>
              </template></n-tag>
            <n-tag type="info" strong v-show="scoped.row.status === 11" round size="small">
              Submitting
              <template #icon>
                <i class="iconfont icon-dengluchaoshi"></i>
              </template></n-tag>
            <n-tag type="success" strong v-show="scoped.row.status === 12" round size="small">
              Compiling
              <template #icon>
                <i class="iconfont icon-dengluchaoshi"></i>
              </template></n-tag>
            <n-tag type="info" strong v-show="scoped.row.status === 13" round size="small">
              Judging
              <template #icon>
                <i class="iconfont icon-dengluchaoshi"></i>
              </template>
            </n-tag>
          </template>
        </el-table-column>
        <el-table-column prop="time" label="运行时间" align="center">
          <template #default="scoped">
            {{ scoped.row.time || "--" }}ms
          </template>
        </el-table-column>
        <el-table-column prop="memory" label="运行内存" align="center">
          <template #default="scoped">
            {{ getmemory(scoped.row.memory, 0) }}
          </template>
        </el-table-column>
        <el-table-column prop="score" label="分数" align="center">
          <template #default="scoped">
            {{ scoped.row.score || "--" }}
          </template>
        </el-table-column>
        <el-table-column prop="language" label="语言" align="center"></el-table-column>
      </el-table>
    </el-scrollbar>
    <div class="footer">
      <el-pagination class="pagination" :page-sizes="[10, 20, 30]" background small layout="prev, pager, next,sizes"
        :total="Number(judgeList.total)" v-model:current-page="judgeParams.pageNum"
        v-model:page-size="judgeParams.pageSize" />
    </div>
  </div>
</template>

<script setup>
import { getJudgeListAPI } from '@/api/ojAPI/ojAPI'
import { onMounted, reactive, watch } from 'vue'
import useStore from "@/store"
import { useRouter } from 'vue-router'

const store = useStore()
const router = useRouter()
const props = defineProps({
  pid: String,
  height: String
})

onMounted(() => {
  judgeParams.pid = props.pid
  judgeParams.username = store.oj.userData.username
})

const judgeList = reactive({
  records: [],
  total: 10
})


const judgeParams = reactive({
  pageNum: 1,
  pageSize: 10,
  status: 15,
  pid: '',
  username: '',
  displayPid: ''
})

watch(judgeParams, (newV, oldV) => {
  getJudgeList()
})
const getJudgeList = async () => {
  await getJudgeListAPI(judgeParams).then(res => {
    if (res.data.code === 200) {
      Object.assign(judgeList, res.data.data)
    }
  }).catch(err => {
    console.log(err)
  })
}

const arr = ['B', 'KB', 'MB', "GB"]
const getmemory = (val, index) => {
  if (val == null) {
    return "--B"
  }
  if (val < 1024) {
    return val + arr[index]
  }
  index += 1
  val = Number((val / 1024).toFixed(2))
  return getmemory(val, index)
}

const getDay = (time) => {
  const now = Date.now()
  var timer = Date.parse(time)
  const day = Math.round((now - timer) / 1000 / 60 / 60 / 24)
  if (day < 1) {
    return "昨天"
  }
  return day + "天前"
}


const handlerToDeatile = (row) => {
  router.push({
    path: `/home/evaluation-detail/${row.submitId}`
  })
}
</script>

<style lang="less" scoped>
.mySubmit {
  display: flex;
  flex-direction: column;

  .scrollbar {
    height: 90%;
  }

  .footer {
    height: 10%;
    margin: auto 0 0 0;
    display: flex;
    justify-content: center;
  }
}
</style>